@using Yozeev.Web.Portal.Startup.Navigation
@using Yozeev.Web.Portal.Views.Home.Components.HomeArchitectureIntro
@using Yozeev.Web.Portal.Views.Home.Components.HomeBanner
@using Yozeev.Web.Portal.Views.Home.Components.HomeBottomIntro
@using Yozeev.Web.Portal.Views.Home.Components.HomeInfrastructure



@{
    ViewBag.CurrentPageName = PortalNavPageNames.Home;
    ViewBag.Title = "首页";
}


<!-- Hero Section -->

@await Component.InvokeAsync(typeof(HomeBannerViewComponent))

<!-- CTA Section -->

<div class="  text-white text-center">
    <span class="btn btn-xs btn-soft-dark btn-pill mb-2">创业不易，请点击广告支持我们</span><br>

    <a href="https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=hx9ksbv4" target="_blank"> <img src="~/imgs/csp_rebate/aliyun.jpg" /> </a>

    <a href="https://gitee.com/enterprises?invite_code=yoyocms" target="_blank">   <img src="/imgs/csp_rebate/giteegold.jpg" style="height: 120px;"></a>




</div>



<!-- End CTA Section -->
@* 配套基础设施 *@
@await Component.InvokeAsync(typeof(HomeInfrastructureViewComponent), new { advantageViewModels = ViewBag.Supportings });

<div class="  text-white text-center">
    <span class="btn btn-xs btn-soft-dark btn-pill mb-2">创业不易，请点击广告支持我们</span><br>
    <a href="https://cloud.tencent.com/redirect.php?redirect=1036&cps_key=9ccaa3d31d7605e5a464ca52ba128330&from=console" target="_blank"><img src="~/imgs/csp_rebate/t_cloud.jpg" /></a>
    <a href="https://www.west.cn?ReferenceID=575986" target=_blank><img src="https://www.west.cn/vcp/vcp_img/free6/B/100x100_B.jpg" border=0></a>
    <a href="https://console.upyun.com/register/?invite=B1cmwDNO4" target=_blank><img src="/imgs/csp_rebate/youpaiyun.jpg" style="height: 120px;"></a>
    <a href="https://portal.qiniu.com/signup?code=3lh1xdsgg00gi" target=_blank><img src="/imgs/csp_rebate/qiniuyun.jpg" style="height: 120px;"></a>




</div>
<!-- — 架构概览—-->
@await Component.InvokeAsync(typeof(HomeArchitectureIntroViewComponent))
 





<!-- Icon Blocks Section -->
<div class="container space-top-3 space-bottom-md-3 space-bottom-2">
    <!-- Title -->
    <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-9">
        <span class="btn btn-xs btn-soft-success btn-pill mb-2">我们的特点?</span>
        <h2>提供一套完整的内容管理框架，让您无须考虑架构，性能，系统资源调配等基础设施问题。</h2>
    </div>
    <!-- End Title -->

    <div class="row">
        <div class="col-md-4 mb-7">
            <div class="text-center px-lg-3">
                <span class="btn btn-icon btn-lg btn-soft-danger rounded-circle mb-5">
                    <span class="fab fa-yelp fa-2x btn-icon__inner btn-icon__inner-bottom-minus"></span>
                </span>
                <h3 class="h5">专业合理化的设计</h3>
                <p class="mb-md-0">在一个模板内实现几乎所有的通用功能和布局内容</p>
            </div>
        </div>

        <div class="col-md-4 mb-7">
            <div class="text-center px-lg-3">
                <span class="btn btn-icon btn-lg btn-soft-primary rounded-circle mb-5">
                    <span class="fas fa-fire fa-2x btn-icon__inner btn-icon__inner-bottom-minus"></span>
                </span>

                <h3 class="h5">开发者友好</h3>
                <p class="mb-md-0">扩展在软件开发领域中扮演的角色越来越重要，一个对开发者友好的内容管理框架，能很大程度地提高团队开发效率。</p>
            </div>
        </div>

        <div class="col-md-4 mb-7">
            <div class="text-center px-lg-3">
                <span class="btn btn-icon btn-lg btn-soft-success rounded-circle mb-5">
                    <span class="fab fa-whmcs fa-2x btn-icon__inner btn-icon__inner-bottom-minus"></span>
                </span>
                <h3 class="h5">SO EASY 二次开发</h3>
                <p class="mb-md-0">在框架中找到您需要的内容，并随意组合特性和实现功能。</p>
            </div>
        </div>
    </div>

    <img class="img-fluid d-none d-md-block w-75 mx-auto mb-7" src="~/front-assets/svg/components/pointer-1.svg" alt="SVG Arrow">

    <!-- Title -->
    <div class="w-md-60 w-lg-50 text-center mx-auto mb-7">
        <h4 class="h5">
            快速简洁而优雅 <span class="font-weight-normal">从52ABP开始创建你的第一个项目.</span>
        </h4>
    </div>
    <!-- End Title -->
    <!-- Mockup Browser -->
    <div class="u-browser-v1 mx-auto mb-4">
        <!-- SVG Background Shape -->
        <figure id="SVGbgShapeID1" class="svg-preloader ie-soft-triangle-shape">
            <img class="js-svg-injector" src="~/front-assets/svg/components/soft-triangle-shape.svg" alt="Image Description"
                 data-parent="#SVGbgShapeID1">
        </figure>
        <!-- End SVG Background Shape -->
        <!-- Mockup Browser -->
        <figure id="SVGBrowserShape" class="svg-preloader ie-browser u-browser-v1__svg">
            <img class="js-svg-injector" src="~/front-assets/svg/illustrations/browser.svg" alt="Image Description"
                 data-img-paths='[
                 {"targetId": "#SVGBrowserShapeImg1", "newPath": "/imgs/banner/abp-design.png"}
               ]'
                 data-parent="#SVGBrowserShape">
        </figure>
        <!-- End Mockup Browser -->
    </div>
    <!-- End Mockup Browser -->

    <div class="w-50 w-md-40 w-lg-30 text-center mx-auto">
        <p class="small">
            兼容多平台,52ABP免费提供强大稳定的API，实现PC、手机Web、APP、微信、小程序等多种平台不同场景的支持，让您轻松应对多种需求
        </p>
    </div>
</div>


<!-- End Icon Blocks Section -->
<!-- End Pricing Section -->
@*<!-- Blog News Section -->
    <div class="gradient-half-primary-v2">
        <div class="container space-2 space-md-3 px-lg-7">
            <!-- Title -->
            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-9">
                <span class="btn btn-xs btn-soft-success btn-pill mb-2">News &amp; Blog</span>
                <h2>Read our latest news</h2>
                <p>Our duty towards you is to share our experience we're reaching in our work path with you.</p>
            </div>
            <!-- End Title -->
            <!-- News Carousel -->
            <div class="js-slick-carousel u-slick u-slick--equal-height u-slick--gutters-3"
                 data-slides-show="3"
                 data-slides-scroll="1"
                 data-arrows-classes="d-none d-lg-inline-block u-slick__arrow u-slick__arrow--offset u-slick__arrow-centered--y rounded-circle"
                 data-arrow-left-classes="fas fa-arrow-left u-slick__arrow-inner u-slick__arrow-inner--left"
                 data-arrow-right-classes="fas fa-arrow-right u-slick__arrow-inner u-slick__arrow-inner--right"
                 data-pagi-classes="text-center u-slick__pagination mt-7 mb-0"
                 data-responsive='[{
                   "breakpoint": 992,
                   "settings": {
                     "slidesToShow": 2
                   }
                 }, {
                   "breakpoint": 768,
                   "settings": {
                     "slidesToShow": 1
                   }
                 }, {
                   "breakpoint": 554,
                   "settings": {
                     "slidesToShow": 1
                   }
                 }]'>
                <!-- Blog News -->
                <a class="js-slide bg-img-hero gradient-overlay-half-dark-v1 transition-3d-hover rounded-pseudo my-4" href="../blog/single-article-classic.html" style="background-image: url(~/front-assets/img/400x500/img1.jpg);">
                    <article class="align-self-end w-100 text-center p-6">
                        <h3 class="h4 text-white">How to make trust your competitive advantage</h3>
                        <div class="mt-4">
                            <strong class="d-block text-white-70 mb-2">Neyton Burchie</strong>
                            <div class="u-avatar mx-auto">
                                <img class="img-fluid rounded-circle" src="~/front-assets/img/100x100/img3.jpg" alt="Image Description">
                            </div>
                        </div>
                    </article>
                </a>
                <!-- End Blog News -->
                <!-- Blog News -->
                <div class="js-slide position-relative bg-white shadow-sm transition-3d-hover rounded my-4">
                    <article class="align-self-end w-100 text-center p-6">
                        <h3 class="h6 font-weight-normal">" How to help your team excel at remote collaboration. Here are tips and tools we use on the content team at InVision to keep our remote collaboration game strong. Trust is both a complex and nuanced topic. Its very nature makes it difficult to tackle through direct effort. "</h3>
                        <div class="my-4">
                            <strong class="d-block mb-2">Keith Margaret</strong>
                            <div class="u-avatar mx-auto">
                                <img class="img-fluid rounded-circle" src="~/front-assets/img/100x100/img2.jpg" alt="Image Description">
                            </div>
                        </div>
                        <a class="btn btn-sm btn-soft-primary btn-wide transition-3d-hover" href="../blog/single-article-classic.html">Read More</a>
                    </article>
                </div>
                <!-- End Blog News -->
                <!-- Blog News -->
                <a class="js-slide bg-img-hero gradient-overlay-half-dark-v1 transition-3d-hover rounded-pseudo my-4" href="../blog/single-article-classic.html" style="background-image: url(~/front-assets/img/400x500/img2.jpg);">
                    <article class="align-self-end w-100 text-center p-6">
                        <h3 class="h4 text-white">Remote workers, here's how to dodge distractions</h3>
                        <div class="mt-4">
                            <strong class="d-block text-white-70 mb-2">Tina Krueger</strong>
                            <div class="u-avatar mx-auto">
                                <img class="img-fluid rounded-circle" src="~/front-assets/img/100x100/img1.jpg" alt="Image Description">
                            </div>
                        </div>
                    </article>
                </a>
                <!-- End Blog News -->
                <!-- Blog News -->
                <div class="js-slide position-relative bg-white shadow-sm transition-3d-hover rounded my-4">
                    <article class="align-self-end w-100 text-center p-6">
                        <h3 class="h6 font-weight-normal">" 4 salary negotiation mistakes you've probably made. Four years ago, I was making $25 per hour as a freelance digital designer building ecommerce sites. I had no idea how to increase my hourly rate, even if I'd wanted to. "</h3>
                        <div class="my-4">
                            <strong class="d-block mb-2">Neyton Burchie</strong>
                            <div class="u-avatar mx-auto">
                                <img class="img-fluid rounded-circle" src="~/front-assets/img/100x100/img3.jpg" alt="Image Description">
                            </div>
                        </div>
                        <a class="btn btn-sm btn-soft-primary btn-wide transition-3d-hover" href="../blog/single-article-classic.html">Read More</a>
                    </article>
                </div>
                <!-- End Blog News -->
                <!-- Blog News -->
                <a class="js-slide bg-img-hero gradient-overlay-half-dark-v1 transition-3d-hover rounded-pseudo my-4" href="../blog/single-article-classic.html" style="background-image: url(~/front-assets/img/400x500/img3.jpg);">
                    <article class="align-self-end w-100 text-center p-6">
                        <h3 class="h4 text-white">Steal these ideas to stay happy and productive</h3>
                        <div class="mt-4">
                            <strong class="d-block text-white-70 mb-2">Liza Nelson</strong>
                            <div class="u-avatar mx-auto">
                                <img class="img-fluid rounded-circle" src="~/front-assets/img/100x100/img4.jpg" alt="Image Description">
                            </div>
                        </div>
                    </article>
                </a>
                <!-- End Blog News -->
            </div>
            <!-- End News Carousel -->
        </div>
    </div>*@
<!-- End Blog News Section -->
@*@await Component.InvokeAsync(typeof(HomeDownloadTemplateViewComponent))*@
@await Component.InvokeAsync(typeof(HomeBottomIntroViewComponent))


<div class="container text-center space-1 space-bottom-md-1">
    <h4 class="h5 text-muted mb-3">合作伙伴</h4>
    <div class="row">
        <div class="col-md-12">
            <ul class="cmf-partners">

                <li><a href="https://www.west.cn/?ReferenceID=575986" target="_blank"><img src="https://www.west.cn/images2016/logo.jpg"></a></li>
                <li><a href="https://52abp.ke.qq.com/" target="_blank"><img src="https://8.url.cn/edu/edu_modules/edu-ui/img/bg/logo-3x.46efb146.png#unsprite"></a></li>
                <li><a href="https://dwz.cn/kQydQrTe" target="_blank"><img src="https://edu-image.nosdn.127.net/51373455cc3e4a96a802e89387cb868c.png?imageView&quality=100"></a></li>

                <li>
                    <a href="https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=hx9ksbv4" target="_blank"><img src="https://www.thinkcmf.com/themes/simplecmf3/public/images/home/partner/ali.jpg"></a>
                </li>
                <li><a href="https://cloud.tencent.com/redirect.php?redirect=1036&cps_key=9ccaa3d31d7605e5a464ca52ba128330&from=console" target="_blank"><img src="/imgs/partners-logo/tcloud.jpg"></a></li>

                <li>
                    <a href="http://www.oschina.net" target="_blank">
                        <img src="https://www.thinkcmf.com/themes/simplecmf3/public/images/home/partner/oschina.png">
                    </a>
                </li>
                <li><a href="https://gitee.com/enterprises?invite_code=yoyocms" target="_blank"><img src="https://gitee.com/logo-black.svg?20171024"></a></li>
                <li>
                    <a href="https://portal.qiniu.com/signup?code=3lh1xdsgg00gi" target="_blank">
                        <img src="/imgs/csp_rebate/qiniuyun.jpg">
                    </a>
                </li>
                <li>
                    <a href="https://console.upyun.com/register/?invite=B1cmwDNO4" target="_blank">
                        <img src="/imgs/csp_rebate/youpaiyun.jpg">
                    </a>
                </li>
            </ul>
        </div>
    </div>
</div>

